<template>
<!--  组件结构-->
  <div>
    <h1 v-text="msg" ref="title"></h1>
    <button ref="bt" @click="showdom">点我输出上面的dom元素</button>
    <img src="./assets/logo.png" alt="log">
    <School ref="scl"/>
  </div>
</template>

<script>
  //引入school组件
import School from './components/School.vue';
//组件交互相关代码（数据、方法等）
export default{
    name:'App',
   components:{
     School,
   },
  data(){
       return {msg:'你好召唤师！！！'}
  },
  methods:{
      showdom(){
        console.log('@@',this.$refs)
        console.log('@@',this.$refs.title) //真是dom元素
        console.log('@@',this.$refs.scl)   //school组件的实例对象
        console.log('@@',this.$refs.bt)  //真是dom元素
      }
  }
  }

</script>
